<template>
  <span>
      <u-tag :text="item.label" mode="plain" v-for="(item, idx) in options.items" :key="idx"
             v-if="item.value === value"/>
  </span>
</template>
<script>

export default {
  props: {
    value: {
      type: String,
      default: ''
    },
    dictType: {
      type: String,
      default: ''
    },
    items: {
      type: Array,
      default() {
        return [];
      }
    },
    itemLabel: {
      type: String,
      default: 'name'
    },
    itemValue: {
      type: String,
      default: 'value'
    }
  },
  data() {
    return {
      options: {
        value: this.value,
        items: this.items
      }
    };
  },
  watch: {
    value(val, oldVal) {
      this.options.value = val;
    },
    items(val, oldVal) {
      this.options.items = val;
    }
  },
  created() {
    this.loadData();
  },
  methods: {
    loadData() {
      console.log("==", this.value)
      if (this.dictType != '') {
        this.$u.api.dictData({dictType: this.dictType}).then(res => {
          if (typeof res === 'object' && res.result === 'login') {
            return;
          }
          this.options.items = res.data;
        });
      } else {
        this.options.items = this.items;
      }
    },
    change(val) {
      this.$emit('input', val);
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
